<template>
  <input
    type="text"
    :value="currentValue"
    @input="handleInput"
    @blur="handleBlur"
  />
</template>

<script>
export default {
  name: "vInput",
  data() {
    return {
      currentValue: "",
    };
  },
  methods: {
    handleInput(e) {
      const value = e.target.value;
      this.currentValue = value;
      this.$emit("input", value);
      this.dispatch("vFormItem", "on-form-change", value);
    },
    handleBlur() {
      this.dispatch("vFormItem", "on-form-blur", this.currentValue);
    },
  },
};
</script>

<style>
</style>